import React from "react";
import { Steps } from "antd";
import { Menu, Dropdown } from "antd";
import { DownOutlined } from "@ant-design/icons";
import { Empty } from "antd";
import AntdImage from "./antdImage";
import AntdList from "./antdList";
const { Step } = Steps;
const menu = (
    <Menu>
        <Menu.Item>
            <a
                target="_blank"
                rel="noopener noreferrer"
                href="https://www.antgroup.com"
            >
                1st menu item
            </a>
        </Menu.Item>
        <Menu.Item icon={<DownOutlined />} disabled>
            <a
                target="_blank"
                rel="noopener noreferrer"
                href="https://www.aliyun.com"
            >
                2nd menu item (disabled)
            </a>
        </Menu.Item>
        <Menu.Item disabled>
            <a
                target="_blank"
                rel="noopener noreferrer"
                href="https://www.luohanacademy.com"
            >
                3rd menu item (disabled)
            </a>
        </Menu.Item>
        <Menu.Item danger>a danger item</Menu.Item>
    </Menu>
);

class AntdLearn extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            data: [],
        };
    }
    render() {
        return (
            <div>
                <Empty />
                <Steps current={2}>
                    <Step title="Finished" description="This is a description." />
                    <Step
                        title="In Progress"
                        subTitle="Left 00:00:08"
                        description="This is a description."
                    />
                    <Step title="Waiting" description="This is a description." />
                </Steps>
                <Dropdown overlay={menu}>
                    <a className="ant-dropdown-link" onClick={(e) => e.preventDefault()}>
                        Hover me <DownOutlined />
                    </a>
                </Dropdown>
                <AntdImage />
                <AntdList />
            </div>
        );
    }
}
export default AntdLearn;
